He estado trabajando en un proyecto y rehaciendo Snake. Se supone que todo el código establece la posición de la manzana en un número aleatorio y lo registra como si lo hiciera, pero la manzana permanece en el mismo lugar. El tipo de posición es "relativo", por lo que permanece dentro de un cuadro. Esta es la primera vez que uso HTML y Javascript juntos. El código simplemente no funciona (no hay errores ni advertencias). El código de generación de números aleatorios es el siguiente:

 function rand(min, max, step) { var delta, range, rand; if (arguments.length < 2) { max = min; min = 0; } if (!step) { step = 1; } delta = max - min; range = delta / step; rand = Math.random(); rand *= range; rand = Math.floor(rand); rand *= step; rand += min; return parseInt(rand); }

El código para establecer la posición de "manzanas" (en js):

 function generateApple() { let y = parseInt(rand(-15, 470, 15)) apple.style.top = y console.log(apple.style.top) }

Imprime con éxito la nueva ubicación pero no mueve el objeto HTML "manzana" a la posición. Tengo la posición inicial establecida en 15 en style.left y 15 en style.top . El CSS para la manzana es el siguiente:

 .apple { height: 15px; width: 15px; background-color: red; border: 2px; }

El código que establece la posición como relativa cuando se carga la ventana es el siguiente

 window.addEventListener('load', () => { snake.style.position = 'relative'; apple.style.position = 'relative' snake.style.left = 105; snake.style.top = 105; apple.style.top = 15; apple.style.left = 15; if (highScore == null) { window.localStorage.setItem('high_score', 0) } });

El código completo está en este sitio web: https://passionproject.on.fleek.co